border = 1px solid #ccc
general-code-color = #6D180B
link-color = #4183C4
background-color = #f8f8f8
code-font-family = Consolas, "Liberation Mono", Courier, monospace

block-style(left-right-padding)
   margin: 15px 0
   padding: 5px left-right-padding
   font-size: 15px
   line-height: 1.5
   border: border
   border-radius: 3px
   background-color: background-color

html
   margin: 0
   padding: 0

body
   margin: 15px 30px
   font-size: 16px
   font-family: Helvetica, Arial, Freesans, Clean, Sans-serif
   line-height: 1.6
   background: url("/app/images/background.jpg") no-repeat center top
   background-color: white
   color: #333
   -webkit-font-smoothing: antialiased

header
   padding: 10px 0
   border-bottom: 1px solid #ccc

   .title
      text-align: center
      font-weight: bold

.documentation-main
   min-width: 400px
   max-width: 1200px
   margin: 0 auto

h1, h2, h3, h4, h5, h6
   color: #000
   cursor: text
   font-weight: bold
   padding: 0

h1, h2
   margin: 30px 0

h3, h4, h5, h6
   margin: 20px 0

h2
   font-size: 24px

h3
   font-size: 20px

h4, h5
   font-size: 18px

p
   display: block
   margin: 15px 0
   text-align: left

a
   color: link-color
   text-decoration: none

blockquote
   block-style(20px)
   display: block

:not(pre)>code
   font-family: code-font-family
   padding: 1px 3px
   border: border
   border-radius: 4px
   color: general-code-color
   background-color: #f2f2f2
   text-shadow: none
   white-space: nowrap

pre
   block-style(10px)
   color: #000
   overflow-x: scroll

   code
      font-family: code-font-family !important

table
   margin: 16px
   padding: 0 // for tr:nth-child(2n) to look good
   border: border
   border-radius: 3px
   border-spacing: 0
   text-align: left

   tr:nth-child(2n)
      background-color: background-color

   th
      background-color: background-color
      padding: 8px
      font-weight: bold

   td
      padding: 8px
      vertical-align: top

.tip
   margin: 20px
   padding: 10px
   display: flex
   justify-content: center
   align-items: center

   .icon
      background: url("/app/images/tip.jpg") no-repeat
      width: 50px
      height: 24px

   .content
      padding: 0 15px
      border-left: 1px solid #ccc

      p
         margin: 5px 0
